<template>
	<view class="container">
		
		<view class="yaoqing">
			<view class="shequng">
				<text class="shequng1">{{$t('shequng.myshequng')}}</text>
				<text class="shequng2">{{$t('shequng.jieshao')}}</text>
			</view>
			<view class="yaoqing1">
				<image class="yaoqing1-img" src="/static/icon/lianjie.png" mode=""></image>
				<text class="shequng2">{{$t('shequng.yaoqing')}}</text>
			</view>
			<!-- <view class="lianjie">
				<text>{{$t('shequng.lianjie')}}</text>
				<view class="lianjie1">
					<text>{{wanzhi}}</text>
					<image @click="fuzhi" class="lianjie1img" src="/static/icon/fuzhi.png" mode=""></image>
				</view>
			</view> -->
			<view class="lianjie">
				<text>{{$t('shequng.lianjie')}}</text>
				<view class="lianjie1">
					<text>{{wanzhi2}}</text>
					<image @click="fuzhi2" class="lianjie1img" src="/static/icon/fuzhi.png" mode=""></image>
				</view>
			</view>
			<!-- <view class="lianjie">
				<text>{{$t('shequng.yaoqingma')}}</text>
				<view class="lianjie1">
					<text>{{yqm}}</text>
					<image @click="fuzhi1" class="lianjie1img" src="/static/icon/fuzhi.png" mode=""></image>
				</view>
			</view> -->
			<view class="yaoqing1">
				<image class="yaoqing1-img" src="/static/icon/fenlei.png" mode=""></image>
				<text class="shequng2">{{$t('shequng.zhituishuju')}}</text>
			</view>
			<view class="zhitui">
				<view class="zhitui1" >
					<view class="zhitui4" v-for="(item,index) in biaotou" :key="index">
					<text>{{item}}</text>
					</view>
				</view>
				<z-paging ref="paging" v-model="dataList" use-page-scroll :auto-show-back-to-top="true"
						:showRefresherUpdateTime="true" @query="queryList">
				<view class="zhitui2">
					
					<view class="zhitui3" v-for="(item,index) in dataList" :key="index">
						<view class="zhitui4">
							<text>{{formatNumber(item.dizhi)}}</text>
						</view>
						<view class="zhitui4">
							<text>{{$t('shequng.zhitui')}}</text>
						</view>
					</view>
				</view>
				</z-paging> 
			</view>
		</view>
	</view>
</template>

<script>
	import ZPMixin from '@/uni_modules/z-paging/components/z-paging/js/z-paging-mixin'
	import walletMixin from "@/mixins/walletMixin.js"; // 钱包混入
	import userService from "@/api/userService.js"; // 用户服务

	export default {
		mixins: [ZPMixin, walletMixin],
		data() {
			return {
				dataList:[],
				wanzhi:"",
				wanzhi2:"",
				yqm:"",
				index:0,
				biaotou: [this.$t('shequng.dizhi'),this.$t('shequng.guanxi')],
			}
		},
		async created() {
			// 从用户服务获取最新的邀请码
			await this.refreshInviteCode();
		},
		onLoad() {
		uni.setNavigationBarTitle({
		  title:  this.$t('shequn'), // 必填，页面标题）
		 })		
		},
		methods: {
			// 刷新邀请码
			async refreshInviteCode() {
				try {
					// 从用户服务获取最新的邀请码
					const result = await userService.getInviteCode();
					
					if (result.success) {
						this.yqm = result.inviteCode;
						this.wanzhi = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
						this.wanzhi2 = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
						console.log('邀请码已更新:', this.yqm);
					} else {
						// 如果获取失败，先尝试获取用户信息，然后再获取邀请码
						console.log('邀请码获取失败，尝试获取用户信息:', result.error);
						const userInfoResult = await userService.getUserInfo();
						
						if (userInfoResult.success) {
							// 用户信息获取成功，再次尝试获取邀请码
							const inviteResult = await userService.getInviteCode();
							if (inviteResult.success) {
								this.yqm = inviteResult.inviteCode;
								this.wanzhi = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
								this.wanzhi2 = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
								console.log('通过获取用户信息后，邀请码已更新:', this.yqm);
							} else {
								// 仍然失败，使用缓存中的邀请码
								this.yqm = uni.getStorageSync('yqm') || '';
								this.wanzhi = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
								console.log('使用缓存邀请码:', this.yqm);
								this.wanzhi2 = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
							}
						} else {
							// 用户信息获取失败，使用缓存中的邀请码
							this.yqm = uni.getStorageSync('yqm') || '';
							this.wanzhi = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
							this.wanzhi2 = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
							console.log('用户信息获取失败，使用缓存邀请码:', this.yqm);
						}
					}
				} catch (error) {
					console.error('获取邀请码失败:', error);
					// 使用缓存中的邀请码作为备选
					this.yqm = uni.getStorageSync('yqm') || '';
					this.wanzhi = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
					this.wanzhi2 = `https://www.asxgt.com/#/?yqm=${this.yqm}`;
				}
			},

			// 重写用户信息更新方法
			async updateUserInfo() {
				// 当用户信息更新时，同时刷新邀请码
				await this.refreshInviteCode();
			},

			// 格式数字
			 formatNumber(number) {
			      // 将数字转化为字符串
			      const str = number.toString();
			      // 提取前四位和后四位，中间用省略号代替
			      const start = str.slice(0, 4);
			      const end = str.slice(-4);
			      return `${start}......${end}`;
			    },
				// 列表
				queryList(pageNo, pageSize) {
					let data = {
						yema:pageNo,
						yezhi: pageSize,
					}
					let opts = {
						url: '/user/GetZTLIST',
						method: 'GET'
					};
					// console.log('打印入参',data);
					this.api.httpTokenRequest(opts, data).then(res => {
						// console.log('直推列表', res);
						if (res[1].data.state == 'success') {
							this.$refs.paging.complete(res[1].data.list)
						}else{
							this.$modal.msg(res[1].data.msg)
						}
					
					})
					
					
				},
				fuzhi(){
					var that=this
					uni.setClipboardData({
						data: that.wanzhi,
						showToast: false,
						success: function() {
							 that.$modal.msg(that.$t('msg.error6'))
						},
						fail: function() {
					
						}
					});
				},
				fuzhi2(){
					var that=this
					uni.setClipboardData({
						data: that.wanzhi2,
						showToast: false,
						success: function() {
							 that.$modal.msg(that.$t('msg.error6'))
						},
						fail: function() {
					
						}
					});
				},
		},
	}
</script>

<style>
	.container{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.shequng{
		width: 94%;
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		margin-top: 20rpx;
		border-radius: 10rpx;
		/* background-color: #383e6b; */
		border: 1rpx solid #aef0f5;
	}
	.shequng1{
		font-size: 32rpx;
		font-weight: 700;
	}
	.shequng2{
		font-size: 28rpx;
		margin-top: 20rpx;
		line-height: 32rpx;
	}
	/* 邀请 */
	.yaoqing{
		width: 94%;
		padding: 20rpx;
		border: 1rpx solid #aef0f5;
		border-radius: 15rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.yaoqing1{
		width: 100%;
		height: 60rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-top: 20rpx;
		
	}
	.yaoqing1-img{
		width: 45rpx;
		height: 40rpx;
	}
	.shequng2{
		font-size: 28rpx;
		font-weight: 700;
		margin-left: 10rpx;
	}
	.yaoqingma{
		width: 96%;
		height: 80rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 20rpx;
		background-color: #1b2587;
		border-radius: 10rpx;
		margin-top: 30rpx;
	}
	.lijibangding{
		width: 96%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		/* background-color: #1b2587; */
		border: 1rpx solid #cee8fc;
		border-radius: 10rpx;
		font-weight: 700;
		font-size: 30rpx;
		margin-top: 20rpx;
	}
	.lianjie{
		width: 94%;
		height: 60rpx;
		padding: 20rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		font-size: 28rpx;
		font-weight: 500;
		margin-top: 20rpx;
		/* background-color: #383e6b; */
		border: 1rpx solid #aef0f5;
		border-radius: 10rpx;
	}
	.lianjie1{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.lianjie1img{
		width: 40rpx;
		height: 40rpx;
		margin-left: 10rpx;
	}
	.zhitui{
		width: 94%;
		padding: 20rpx;
		margin-top: 20rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		/* background-color: #383e6b; */
		border: 1rpx solid #aef0f5;
		border-radius: 10rpx;
	}
	.zhitui1{
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 30rpx;
		margin-top: 10rpx;
		font-size: 30rpx;
		font-weight: 700;
	}
	.zhitui2{
		width: 660rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		
		
	}
	.zhitui3{
		width: 100%;
		padding-top: 20rpx;
		margin-bottom: 20rpx;
		border-top: 1rpx solid #191919;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content:space-between;
		font-size: 26rpx;
	}
	.zhitui4{
		width: 30%;
		display: flex;
		justify-content: center;
	}
</style>